<template>
  <div class="limitdivc">
    <br />
    <br />
    <br />
    <br />
    <el-form ref="parkingcost" :model="parkingcost" label-width="100px">
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="业主姓名">
            <el-input v-model="owner_name" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="业主车牌号">
            <el-input v-model="parkingcost.ownerCar" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="停车位">
            <el-input v-model="parkingcost.ownerParkingId"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="初始停车时间">
            <el-date-picker v-model="parkingcost.parkingBeginTime" type="date"></el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <el-button class="buttenstylec" type="primary" @click="setparking">确认修改</el-button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      centerDialogVisible: false,
      owner_name: "软件163",
      managecarId: "",
      ownerId: "",
      parkingcost: {
        ownerParkingId: "test132",
        ownerCar: "HHHH123",
        parkingTime: 6,
        parkingBeginTime: "2020/4/17",
        parkingEndTime: "2021/4/17",
        parkingPrice: "10",
        parkingTotalCost: 0
      }
    };
  },
  created() {
    this.managecarId = this.$route.query.Id;
    this.axios
      .post(
        "owner/getparking?managecarId=" + this.managecarId
      )
      .then(res => {
        this.parkingcost = res.data[0];
        this.owner_name = res.data[1].ownerName;
        this.ownerId = res.data[1].ownerId;
        console.log(res);
      })
      .catch(err => {
        console.error(err);
      });
    console.log(this.managecarId);
  },
  methods: {
    setparking() {
      this.axios
        .post("owner/setparking", this.parkingcost)
        .then(res => {
          this.$alert("业主停车信息修改成功！", "操作成功", {
            confirmButtonText: "确定",
            callback: action => {
              this.$router.push({
                path: "/index_manager/updataowner",
                query: {
                  id: this.ownerId
                }
              });
            }
          });

          console.log(res);
        })
        .catch(err => {
          console.error(err);
        });
    }
  },
  components: {}
};
</script>

<style scope>
.buttenstyle {
  position: relative;
  left: 960px;
}
.inputstyle {
  font-size: 25px;
  outline: none;
  text-align: center; /**居中显示 */
}
.divace {
  border: 1px solid rgb(12, 11, 11);
}
.el-row {
  margin-bottom: 20px;
}

.el-col {
  border-radius: 4px;
}

.bg-purple {
  background: #ffffff;
}
.grid-content {
  border-radius: 4px; /**角度圆滑*/
  min-height: 36px; /**高度 */
  text-align: center; /**居中显示 */
}
.row-bg {
  padding: 10px 0;
  background-color: #f9fafc;
}
.divcenter {
  /* margin: 0 auto; 
  float:left;
  */
  border: 1px solid #f00;
  width: 50%;
}

.divcontent {
  float: left;
  border: 1px solid rgb(12, 11, 11);
}
</style>
